
import React, { Component } from "react";
import "./index.css";
export default class Header extends Component {
  handleKeyUp = (event) => {
    let { keyCode, target } = event;
    if (keyCode !== 13) return;
    //添加的todo名字不能为空
    if (target.value.trim() == "") {
      alert("输入内容不能为空");
      return;
    }
    //准备好一个todo对象
    let todoObj = { id: Math.random(), name: target.value, done: false };
    //将todo对象传递给父组件（App）
    this.props.addTodo(todoObj);
    //情况输入
    target.value = "";
  };
  render() {
    return (
      <div className="todo-header">
        <input
          onKeyUp={this.handleKeyUp}
          type="text"
          placeholder="请输入你的任务名称，按回车键确认"
        />
      </div>
    );
  }

}